<template>
    <div id="branchDetail" class="main-container" >
        <div >
            <el-form  :model="formData" class="formEmbedTable mt20">
                <table>
                    <caption>Department Information</caption>
                    
                    <tr>
                        <td>Department No.</td>
                        <td>
                            <el-form-item >{{formData.brhId}}</el-form-item>
                        </td>
                        <td>Department Name</td>
                        <td>
                            <el-form-item >{{formData.brhName}}</el-form-item>
                        </td>					
                    </tr>
                    <tr>
                        <td>Category</td>
                        <td>
                            <el-form-item>{{formData.brhLevel==1?"Head office":formData.brhLevel==2?"branch":formData.brhLevel==3?"subbranch":""}}</el-form-item>
                        </td>
                        
                        <td>Status</td>
                        <td>
                            <el-form-item >{{formData.brhStatus==0?"Activation":formData.brhStatus==1?"Freeze":formData.brhStatus==2?"Cancel":""}}</el-form-item>
                        </td>
                    </tr>
                    <tr>
                        <td>Area Code</td>
                        <td>
                            <el-form-item > {{formData.brhRegionId}}</el-form-item>
                        </td>
                        <td>Address</td>
                        <td>
                            <el-form-item > {{formData.brhAddress}}</el-form-item>
                        </td>
                    </tr>
                    <tr>
                        <td>Couplet No.</td>
                        <td>
                            <el-form-item >{{formData.unionNo}}</el-form-item>
                        </td>
                        <td>Liquidate No.</td>
                        <td>
                            <el-form-item>{{formData.lquidateBRH}}</el-form-item>
                        </td>
                    </tr>
                    <tr>
                        <td>Phone No.</td>
                        <td>
                            <el-form-item > {{formData.brhPhone}}</el-form-item>
                        </td>
                        <td>Abbreviation</td>
                        <td>
                            <el-form-item >{{formData.brhShortName}}</el-form-item>
                        </td>	
                        
                    </tr>
                    <tr v-if="formData.brhParentName">
                        <td>Parent Department</td>
                        <td><el-form-item >{{formData.brhParentName}}</el-form-item></td>	
                        <td>Describsion</td>
                        <td><el-form-item > {{formData.brhDesc}}</el-form-item></td>
                    </tr>
                    <tr v-if="!formData.brhParentName">
                        <td>Describsion</td>
                        <td colspan="3"><el-form-item > {{formData.brhDesc}}</el-form-item></td>		
                    </tr>
                </table>
            </el-form>
        </div>
        <div class="btnArea mt20 tac">
            <el-button type="primary" icon="close" @click="back">back</el-button>
        </div>
    </div>
</template>

<script>
    import ghbIcon from '@src/components/icon'
    export default {
        name:'branchDetail',
        components:{
			ghbIcon
		},
        props:['formData'],
        data(){
            return {
            
            }
        },
        methods:{
            back(){
               this.$emit('back','isDetail')
            },
        }
        
    }

</script>